<template>
	<view class="container" :data-theme="theme">
		<view class="header">
			<!-- 搜索头部导航 -->
			<view class="header-nav">
				<u-icon name="arrow-left" size="27" color="black" @click="uniClick"></u-icon>
				<uni-search-bar style="width: 70%;" @blur="searchGoods" v-model="productParams.name" cancelButton="none"
					placeholder="请输入商品名称/关键字查询">
				</uni-search-bar>
			</view>
			<!-- 头部提示文字 -->
			<view class="header-hint">
				促销价设置仅支持售卖中商品，单次最多提交10个商品
			</view>
			<!-- 搜索售卖区域 -->
			<view class="search-tab">
				<picker @change="saleAreaChange" @cancel="saleAreaCancel" @click="saleAreaCancel" :value="saleAreaIndex"
					:range="saleAreaList" range-key="name" style="display: flex;">
					<view style="display: flex;">
						<view style="font-size: 14px;margin-right: 6rpx;" v-if="isShowSaleArea">全部售卖区域
						</view>
						<view style="font-size: 14px;margin-right: 6rpx;" v-else='isShowSaleArea'>
							{{ saleAreaList[saleAreaIndex].name }}
						</view>
						<u-icon :name="saleAreaShow ? 'arrow-down-fill' : 'arrow-up-fill'" size="12"></u-icon>
					</view>
				</picker>
			</view>
			<!-- 一级商品列表 -->
			<tab-bar style="background-color: #FFF;" :tabList="tabList" :tabIndex.sync="tabCurrentIndex"></tab-bar>
		</view>
		<view class="content">
			<!-- 这里是可滚动的内容 -->
			<scroll-view class="scroll-view secondary" scroll-y @scrolltolower="saleAreaScroll">
				<view v-if="tabList[tabCurrentIndex].childList.length > 0"
					v-for="(item, index1) in tabList[tabCurrentIndex].childList" :key="index1" class="item"
					:class="{ active: index1 === secondIndex }" @click="secondClick(item,index1)">
					<view class="name"> {{item.name}} </view>
				</view>
				<!-- 二级分类空数据 -->
				<u-empty class="empty" v-else mode="data" text="暂无数据" style="padding: 50% 0;"
					icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty>
			</scroll-view>
			<!-- <scroll-view class="scroll-view three" scroll-y @scrolltolower="scrollTicketUpload"> -->
			<scroll-view class="scroll-view three" scroll-y>
				<!-- 三级分类空数据 -->
				<checkbox-group
					v-if="tabList[tabCurrentIndex].childList[secondIndex].childList && tabList[tabCurrentIndex].childList[secondIndex].childList.length > 0">
					<view class="panel"
						v-for="(item,index2) in tabList[tabCurrentIndex].childList[secondIndex].childList"
						:key="index2">
						<view class="three-item">
							<view class="three-top">
								<view class="three-top-product">
									<view class="three-top-left">
										<image :src="item.image" mode=""></image>
										<view class="three-top-center">
											<view class="center-top">
												【{{item.brandName}}】{{item.name}}
											</view>
											<view class="center-bottom">{{item.sku}}</view>
										</view>
									</view>
									<view class="three-top-right">
										<checkbox :value="JSON.stringify(item)" :checked="item.checked"
											@click="clickCheckbox(index2)" />
									</view>
								</view>
								<view class="sale-area">
									<view class="sale-area-left">{{item.operateCityName}}</view>
									<view class="sale-area-right">￥{{item.price}}</view>
								</view>
							</view>
						</view>
					</view>

				</checkbox-group>
				<u-empty class="empty" v-else mode="data" style="padding: 25%;"
					icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty>
			</scroll-view>
			<activeConfig ref="activeConfigRefs" :configInfo="configInfo" :generalGiftInfo="generalGiftInfo"
				:partCategoryList="partCategoryList" :threeProductList="threeProductList"
				@byIdCancelStatus="byIdCancelStatus">
			</activeConfig>
		</view>
		<!-- 底部信息 -->
		<view class="footer">
			<view v-if="productScopeIndex == 1">
				<view class="footer-selection">
					<view class="selection-left">已选 <span
							class="font_color selection-left-num">{{threeProductList.length}}</span> </view>
				</view>
				<view class="footer-button">
					<button @click="uniClick">上一步</button>
					<button class="bg_color font-color"
						@click="confirmProduct">{{productScopeIndexObj[productScopeIndex]}}</button>
				</view>
			</view>
			<button v-else class="bg_color font-color footer-submit"
				@click="handleRadio">{{productScopeIndexObj[productScopeIndex]}}</button>
		</view>
	</view>
</template>
<script>
	import {
		setThemeColor
	} from '../../../../utils/setTheme';
	// import {
	// 	storeCategoryAllApi
	// } from "@/api/product.js"
	import {
		getFullGiftProductApi,
		addActivityRegistrationApi,
		getActivityProductApi,
		getCategoryTreeListApi
	} from "@/api/marketing.js"
	import {
		queryBusinessOperateCityApi
	} from "@/api/operateCity.js"
	import tabBar from './tab-bar.vue';
	import activeConfig from "./activeConfig.vue"
	let app = getApp()
	export default {
		components: {
			tabBar,
			activeConfig
		},
		data() {
			return {
				bgColor: "#ffffff",
				theme: app.globalData.theme,

				// ---------------------售卖区域搜索----------------------------
				isShowSaleArea: true, // 售卖区域展示
				saleAreaIndex: 0, // 售卖区域索引值
				// 售卖区域/
				saleAreaList: [{
					name: '全部售卖区域',
					useId: -1
				}, ],
				saleAreaShow: true, // 售卖区域显示
				// ----------------------------end----------------------
				// 树形列表
				tabList: [],
				// 一级分类
				tabCurrentIndex: 0,
				// 二级分类
				secondIndex: 0,
				// 三级分类
				threeIndex: 0,

				// -----------------------------三级分类数据-------------------
				// 三级商品信息
				threeProductList: [],
				// 组合数据所需要的下标
				reassembleDataIndex: [],
				// 判断商品范围   0 全店  1 部分商品 
				productScopeIndex: 0,

				productScopeIndexObj: {
					0: '确定',
					1: '确认商品'
				},
				// 上级页面的优惠阶梯下标
				discountsIndex: 0,
				configInfo: {}, // 活动配置信息
				// ----------------------------满赠方式----------------------
				giveMethodsList: [{
						name: '满赠送',
						value: 1
					},
					{
						name: '满件送',
						value: 2
					},
				],
				// ------------------------------商品信息----------------------------
				// 搜索商品的params参数
				productParams: {
					name: '', // 商品名称
					operateCityId: '', // 售卖区域Id
					categoryId: '', // 二级分类id
					activityCategoryId: 8, // 店铺满赠Id
				},
				// 商品数据
				tabList: [],
				// 添加部分商品的信息
				generalGiftInfo: {},
				// 所有删除的部分品类信息
				partCategoryList: [],
			}
		},
		onLoad(options) {
			this.bgColor = setThemeColor()
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.bgColor,
			});
			this.productScopeIndex = options.productScopeIndex ? options.productScopeIndex : 0
			this.discountsIndex = options.discountsIndex ? options.discountsIndex : 0
			// 判断有没有活动配置信息
			if (options.configInfo) {
				this.configInfo = options.configInfo ? JSON.parse(options.configInfo) : {}
				this.groupConfigInfo(this.configInfo)
			}
			// 添加商品的外层优惠信息
			if (options.generalGiftInfo) {
				this.generalGiftInfo = options.generalGiftInfo ? JSON.parse(options.generalGiftInfo) : {}
			}
			// 所有删除的部分品类信息
			if (options.partCategoryList) {
				this.partCategoryList = options.partCategoryList ? JSON.parse(options.partCategoryList) : []
			}

			// 测试数据
			this.tabList = [{
					id: 519,
					name: "海鲜类",
					isShow: false,
					childList: [{
							id: 520,
							name: "黄鱼",
							isShow: false,
							childList: [{
									id: 521,
									name: "小黄鱼",
									image: "http://img30.360buyimg.com/popWaterMark/jfs/t1/129817/18/27106/65764/632bc467E3f94c37d/3cb67ddb8332ac70.jpg",
									isShow: false,
									checked: false,

									causeBranch: [{
											area: '北京',
											promotionPrice: '', // 促销价格
											money: 1000, // 原价
											// 库存
											radiolist1: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											inventoryNum: '20', // 库存自定义数量
											inventory: true,
											// 日限购 
											radiolist2: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											dateLimitShopNum: '20', // 日限购 自定义数量
											dateLimitShop: true, // 日限购 自定义数量
										},

									],
									childList: []
								},
								{
									id: 522,
									name: "鲫鱼",
									image: "http://img30.360buyimg.com/popWaterMark/jfs/t1/129817/18/27106/65764/632bc467E3f94c37d/3cb67ddb8332ac70.jpg",
									isShow: false,
									checked: false,

									causeBranch: [{
											area: '北京',
											promotionPrice: '', // 促销价格
											money: 100, // 原价
											// 库存
											radiolist1: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											inventoryNum: '20', // 库存自定义数量
											inventory: true,
											// 日限购 
											radiolist2: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											dateLimitShopNum: '20', // 日限购 自定义数量
											dateLimitShop: true, // 日限购 自定义数量
										},

									],
									childList: []

								}
							]
						},
						{
							id: 520,
							name: "黄鱼",
							isShow: false,
							childList: [{
									id: 521,
									name: "胖头鱼",
									image: "http://img30.360buyimg.com/popWaterMark/jfs/t1/129817/18/27106/65764/632bc467E3f94c37d/3cb67ddb8332ac70.jpg",
									isShow: false,
									checked: false,

									causeBranch: [{
											area: '北京',
											promotionPrice: '', // 促销价格
											money: 100, // 原价
											// 库存
											radiolist1: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											inventoryNum: '20', // 库存自定义数量
											inventory: true,
											// 日限购 
											radiolist2: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											dateLimitShopNum: '20', // 日限购 自定义数量
											dateLimitShop: true, // 日限购 自定义数量
										},

									],
									childList: []

								},
								{
									id: 522,
									name: "鲫鱼",
									image: "http://img30.360buyimg.com/popWaterMark/jfs/t1/129817/18/27106/65764/632bc467E3f94c37d/3cb67ddb8332ac70.jpg",
									isShow: false,
									checked: false,

									causeBranch: [{
											area: '北京',
											promotionPrice: '', // 促销价格
											money: 100, // 原价
											// 库存
											radiolist1: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											inventoryNum: '20', // 库存自定义数量
											inventory: true,
											// 日限购 
											radiolist2: [{
													name: '不限',
													disabled: true
												},
												{
													name: '自定义',
													disabled: false
												}
											],
											dateLimitShopNum: '20', // 日限购 自定义数量
											dateLimitShop: true, // 日限购 自定义数量
										},

									],
									childList: []

								}
							]
						}
					]
				},
				{
					id: 523,
					name: "时令水果",
					isShow: false,
					childList: [{
						id: 524,
						name: "水果",
						isShow: false,
						childList: [{
								id: 525,
								name: "苹果",
								image: "http://img30.360buyimg.com/popWaterMark/jfs/t1/129817/18/27106/65764/632bc467E3f94c37d/3cb67ddb8332ac70.jpg",
								isShow: false,
								checked: false,

								causeBranch: [{
										area: '北京',
										promotionPrice: '', // 促销价格
										money: 100, // 原价
										// 库存
										radiolist1: [{
												name: '不限',
												disabled: true
											},
											{
												name: '自定义',
												disabled: false
											}
										],
										inventoryNum: '', // 库存自定义数量
										inventory: true,
										// 日限购 
										radiolist2: [{
												name: '不限',
												disabled: true
											},
											{
												name: '自定义',
												disabled: false
											}
										],
										dateLimitShopNum: '', // 日限购 自定义数量
										dateLimitShop: true, // 日限购 自定义数量
									},

								],
								childList: []
							},
							{
								id: 526,
								name: "香蕉",
								image: "http://img30.360buyimg.com/popWaterMark/jfs/t1/129817/18/27106/65764/632bc467E3f94c37d/3cb67ddb8332ac70.jpg",
								isShow: false,
								checked: false,

								causeBranch: [{
										area: '北京',
										promotionPrice: '', // 促销价格
										money: 100, // 原价
										// 库存
										radiolist1: [{
												name: '不限',
												disabled: true
											},
											{
												name: '自定义',
												disabled: false
											}
										],
										inventoryNum: '20', // 库存自定义数量
										inventory: true,
										// 日限购 
										radiolist2: [{
												name: '不限',
												disabled: true
											},
											{
												name: '自定义',
												disabled: false
											}
										],
										dateLimitShopNum: '20', // 日限购 自定义数量
										dateLimitShop: true, // 日限购 自定义数量
									},

								],
								childList: []
							},
							{
								id: 527,
								name: "荔枝",
								image: "http://img30.360buyimg.com/popWaterMark/jfs/t1/129817/18/27106/65764/632bc467E3f94c37d/3cb67ddb8332ac70.jpg",
								isShow: false,
								checked: false,

								causeBranch: [

									{
										area: '天津',
										promotionPrice: '', // 促销价格
										money: 100, // 原价
										// 库存
										radiolist1: [{
												name: '不限',
												disabled: true
											},
											{
												name: '自定义',
												disabled: false
											}
										],
										inventoryNum: '', // 库存自定义数量
										inventory: true,

										// 日限购 
										radiolist2: [{
												name: '不限',
												disabled: true
											},
											{
												name: '自定义',
												disabled: false
											}
										],
										dateLimitShopNum: '', // 日限购 自定义数量
										dateLimitShop: true, // 日限购 自定义数量
									}
								],
								childList: []
							}
						]
					}]
				}
			]
			this.initData()
		},
		watch: {
			"productParams.keyword"(newVal, oldVal) {
				if (newVal == '') {}
			},
			// 监听一级分类变化二级分类默认是第一条数据
			tabCurrentIndex(newVal, oldVal) {
				this.secondIndex = 0
				this.productParams.categoryId = this.tabList[this.tabCurrentIndex].childList[this.secondIndex].id
				// 只能选择一个商品
				if (this.productScopeIndex == 0) {
					this.getFullGiftProduct()
					// 可以选择多个商品
				} else if (this.productScopeIndex == 1) {
					this.getActivityProduct()
				}
			},
		},
		methods: {
			// 初始化参数
			initData() {
				this.queryBusinessOperateCity()
				this.storeCategoryAll()
			},
			// ---------------------------组合活动配置信息---------------------------------
			groupConfigInfo(info) {
				let discountsList = info.discountsList
				let discountsInfo = []
				for (let i = 0; i < discountsList.length; i++) {
					discountsInfo.push(
						`${discountsList[i].condition}${info.giveMethodsIndex == 0 ? '元' : '件'}赠【${discountsList[i].giftProductInfo.name}】${discountsList[i].giftPieceNum}件`
					)
				}
				this.configInfo.giveMethodsName = this.giveMethodsList[this.configInfo.giveMethodsIndex].name
				this.insertPunctuationBetweenElements(discountsInfo, '、')
			},
			// 给满赠阶梯中间添加分隔符号
			insertPunctuationBetweenElements(arr, punctuation) {
				this.configInfo.discountsList = [];
				for (let i = 0; i < arr.length; i++) {
					this.configInfo.discountsList.push(arr[i]);
					if (i < arr.length - 1) {
						this.configInfo.discountsList.push(punctuation);
					}
				}

			},
			// -------------------关于搜索售卖区域事件------------------------------
			// 售卖区域搜索事件
			saleAreaChange(e) {
				this.isShowSaleArea = false
				this.saleAreaIndex = e.detail.value
				this.saleAreaShow = true
				this.productParams.operateCityId = this.saleAreaList[this.saleAreaIndex].useId
				if (this.productParams.operateCityId == -1) {
					delete this.productParams.operateCityId
				}
				// 只能选择一个商品
				if (this.productScopeIndex == 0) {
					this.getFullGiftProduct(true)
					// 可以选择多个商品
				} else if (this.productScopeIndex == 1) {
					this.getActivityProduct(true)
				}
			},
			// 售卖区域取消事件
			saleAreaCancel() {
				this.saleAreaShow = true
			},
			// 售卖区域点击事件
			saleAreaCancel() {
				this.saleAreaShow = false
			},
			//   ----------------------------------end-------------------------------
			// 搜索货物
			searchGoods() {
				// 只能选择一个商品
				if (this.productScopeIndex == 0) {
					this.getFullGiftProduct(true)
					// 可以选择多个商品
				} else if (this.productScopeIndex == 1) {
					this.getActivityProduct(true)
				}
			},
			// 返回事件
			uniClick() {
				uni.navigateBack();
			},
			// 二级分类点击事件
			secondClick(item, index) {
				this.secondIndex = index
				this.productParams.categoryId = this.tabList[this.tabCurrentIndex].childList[this.secondIndex].id
				// 只能选择一个商品
				if (this.productScopeIndex == 0) {
					this.getFullGiftProduct()
					// 可以选择多个商品
				} else if (this.productScopeIndex == 1) {
					this.getActivityProduct()
				}
			},
			// -----------------------------------------三级分类事件-----------------------------------------
			// 后期可以通过判断三级分类数据中的checked属性判断是否选中来对数据进行操作
			// 单击改变商品事件
			clickCheckbox(index2) {
				// 设置三级分类下标
				this.threeIndex = index2

				// 判断设置选中的商品范围  根据类型不同设置选中的商品数量不同     
				//   0 全店  （只可以选择一个商品）  1 部分商品  （可以选择多个商品）  
				if (this.productScopeIndex == 0) {
					let threeArray = this.tabList[this.tabCurrentIndex].childList[this.secondIndex].childList
					// 计算选中的商品为几个
					let trueCount = threeArray.reduce((count, item) => {
						if (item == true) {
							return count + 1
						} else {
							return count
						}
					}, 0)
					// 判断选中的商品是否只有一个
					if (trueCount == 1) {
						// 选中的只有一个
						this.tabList[this.tabCurrentIndex].childList[this.secondIndex].childList[index2].checked = !this
							.tabList[
								this.tabCurrentIndex].childList[this.secondIndex].childList[index2].checked
					} else {
						// 选中多个  需要先将所有的checked设置为false  再将当前选中的checked设置为true
						this.reassembleData(this.tabList)
						// 将所有的checked选中状态都先不选中设置为false
						this.reassembleDataIndex.forEach(item => {
							this.tabList[item[0]].childList[item[1]].childList[item[2]].checked = false
						})
						// 将该点击的选中状态设置为true
						this.tabList[this.tabCurrentIndex].childList[this.secondIndex].childList[index2].checked = !this
							.tabList[
								this.tabCurrentIndex].childList[this.secondIndex].childList[index2].checked
					}
				} else {
					// 选择多个商品
					this.tabList[this.tabCurrentIndex].childList[this.secondIndex].childList[index2].checked = !this
						.tabList[
							this.tabCurrentIndex].childList[this.secondIndex].childList[index2].checked
				}
				// 计算选中商品的数量
				this.reassembleData(this.tabList)
			},
			// 重新组合数据  checked属性判断是否选中来对数据进行操作
			reassembleData(data) {
				this.threeProductList = []
				this.reassembleDataIndex = []
				data.forEach((item1, index1) => {
					if (item1.childList.length > 0) {
						item1.childList.forEach((item2, index2) => {
							if (item2.childList.length > 0) {
								item2.childList.forEach((item3, index3) => {
									if (item3.checked) {
										this.threeProductList.push(item3)
										// 判断选择的每个选中商品信息的下标
										this.reassembleDataIndex.push([index1, index2, index3])
									}
								})
							}
						})
					}
				})
				return this.threeProductList
			},

			// 用于只需要一级列表和二级列表
			filterData(data) {
				return data.map(item => {
					let newItem = {
						id: item.id,
						pid: item.pid,
						name: item.name,
						icon: item.icon,
						level: item.level,
						sort: item.sort,
						isShow: item.isShow,
						childList: [],
					};

					if (item.childList && item.childList.length > 0) {
						newItem.childList = this.filterData(item.childList.filter(child => child.level === 2));
					}
					return newItem;
				});
			},
			// 通过id找到对应树形结构下对下的所在的下标
			findIndexesById(categories, id, operateCityId, indexes = [], currentPath = []) {
				for (let i = 0; i < categories.length; i++) {
					const category = categories[i];
					currentPath.push(i); // 将当前分类的下标添加到路径中
					if (category.id == id && category.operateCityId == operateCityId) {
						indexes.push([...currentPath]); // 找到匹配的 id，将当前路径复制到 indexes 中
					}

					if (category.childList && category.childList.length > 0) {
						this.findIndexesById(category.childList, id, operateCityId, indexes, currentPath); // 递归处理子分类
					}
					currentPath.pop(); // 回溯，移除当前分类的下标
				}

				return indexes;
			},
			// 通过id以及区域id将所该id对应的数组删除并且取消的他选中状态
			byIdCancelStatus(idOrOperateCityId) {
				const indexes = this.findIndexesById(this.tabList, idOrOperateCityId.id, idOrOperateCityId.operateCityId);
				// 取消选中状态
				indexes.forEach(item => {
					this.tabList[item[0]].childList[item[1]].childList[item[2]].checked = false
				})
				// 删除该数组
				this.threeProductList = this.threeProductList.filter(item => item.id != idOrOperateCityId.id || item
					.operateCityId != idOrOperateCityId.operateCityId)
				uni.showToast({
					title: '删除成功',
					icon: 'success',
					duration: 2000
				})
			},
			// -----------------部分商品确认信息--------------
			confirmProduct() {
				this.reassembleData(this.tabList)
				// 判断有没有选中的商品
				if (this.threeProductList.length > 0) {
					this.$refs.activeConfigRefs.handleActiveConfig()
				} else {
					// 没有商品信息
					uni.showToast({
						title: '请先选择商品',
						icon: 'none',
						duration: 2000
					})
				}
			},

			// -------------------单选选择赠品商品确认----------------
			handleRadio() {
				this.reassembleData(this.tabList)
				if (this.threeProductList.length > 0) {
					this.threeProductList[0].discountsIndex = this.discountsIndex
					const currentPages = getCurrentPages()
					const current = currentPages[currentPages.length - 2]
					uni.navigateBack({
						delta: 1,
						success: (res) => {
							current.addDiscountsProduct(this.threeProductList)
						}
					});
				} else {
					uni.showToast({
						title: '请先选择商品',
						icon: 'none',
						duration: 2000
					})
				}

			},
			// ------------------------------api------------------------------------------
			// 获取二级分类数据
			async storeCategoryAll() {
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				try {
					let res = await getCategoryTreeListApi()
					if (res.code == 200) {
						// 过滤出 level = 1 和 level = 2 的数据
						this.tabList = this.filterData(res.data);
						this.productParams.categoryId = this.tabList[0].childList[0].id
						// 只能选择一个商品
						if (this.productScopeIndex == 0) {
							this.getFullGiftProduct()
							// 可以选择多个商品
						} else if (this.productScopeIndex == 1) {
							this.getActivityProduct()
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 1500
						})
					}
				} catch (e) {
					uni.showToast({
						title: e,
						icon: 'none',
						duration: 1500
					})
					console.log("e", e)
					//TODO handle the exception
				}
				uni.hideLoading()
			},
			// 获取商品赠品信息
			async getFullGiftProduct(status) {
				// 判断如果有数据就不需要发送请求
				if (!status) {
					if (this.tabList[this.tabCurrentIndex].childList[this.secondIndex].childList.length > 0)
						return
				}
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				try {
					let res = await getFullGiftProductApi(this.productParams)
					if (res.code == 200) {

						// 判断有没有数据
						if (!res.data) {
							// 没有数据
							this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList', [])
							uni.hideLoading()
							return
						}
						if (!res.data.queryActivityProductVOList.length) {
							// 没有数据
							this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList', [])
							uni.hideLoading()
							return
						}
						if (res.data.queryActivityProductVOList && res.data.queryActivityProductVOList.length <= 0) {
							this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList',
								res.data.queryActivityProductVOList)
							uni.hideLoading()
							return
						}
						let data = res.data.queryActivityProductVOList
						// 整理自己所需要的数据
						data = data.map(item => {
							return {
								productCategoryId: this.productParams.categoryId,
								childList: [],
								level: 3,
								id: item.id,
								name: item.name,
								image: item.image,
								sku: item.sku,
								isShow: false,
								checked: false,
								operateCityName: item.operateCityName,
								operateCityId: item.operateCityId,
								operateCityId: item.operateCityId,
								price: item.price
							}
						})
						this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList', data)

					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 1500
						})
					}
				} catch (e) {
					uni.showToast({
						title: e,
						icon: 'none',
						duration: 1500
					})
					console.log("e", e)
					//TODO handle the exception
				}
				uni.hideLoading()
			},
			// 查询商品 用于添加多个商品
			async getActivityProduct(status) {
				// 判断如果有数据就不需要发送请求
				if (!status) {
					if (this.tabList[this.tabCurrentIndex].childList[this.secondIndex].childList.length > 0)
						return
				}
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				try {
					let res = await getActivityProductApi(this.productParams)
					if (res.code == 200) {

						// 判断有没有数据
						if (!res.data) {
							// 没有数据
							this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList', [])
							uni.hideLoading()
							return
						}
						if (!res.data.queryActivityProductVOList.length) {
							// 没有数据
							this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList', [])
							uni.hideLoading()
							return
						}
						if (res.data.queryActivityProductVOList && res.data.queryActivityProductVOList.length <= 0) {
							this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList',
								res.data.queryActivityProductVOList)
							uni.hideLoading()
							return
						}
						let data = res.data.queryActivityProductVOList
						// 整理自己所需要的数据
						data = data.map(item => {
							return {
								productCategoryId: this.productParams.categoryId,
								childList: [],
								level: 3,
								id: item.id,
								name: item.name,
								image: item.image,
								sku: item.sku,
								isShow: false,
								checked: false,
								operateCityName: item.operateCityName,
								operateCityId: item.operateCityId,
								operateCityId: item.operateCityId,
								price: item.price
							}
						})
						this.$set(this.tabList[this.tabCurrentIndex].childList[this.secondIndex], 'childList', data)

					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 1500
						})
					}
				} catch (e) {
					uni.showToast({
						title: e,
						icon: 'none',
						duration: 1500
					})
					console.log("e", e)
					//TODO handle the exception
				}
				uni.hideLoading()
			},
			// 获取经营城市（售卖区域）
			async queryBusinessOperateCity() {
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				try {
					let res = await queryBusinessOperateCityApi({
						queryType: 0
					})
					if (res.code == 200) {
						let data = []
						res.data.forEach(item => {
							this.saleAreaList.push(...item.sonVOList.map(item2 => {
								return {
									...item2
								}
							}))
						})
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none',
							duration: 1500
						})
					}
				} catch (e) {
					uni.showToast({
						title: e,
						icon: 'none',
						duration: 1500
					})
					console.log("e", e)
					//TODO handle the exception
				}
				uni.hideLoading()
			},

		}
	}
</script>
<style lang="scss">
	.bg_color {
		@include main_bg_color(theme)
	}

	.font_color {
		@include main_color(theme)
	}

	page {
		height: 100%;


	}

	.container {
		display: flex;
		flex-direction: column;
		height: 100%;
	}

	.header {
		background-color: white;

		// 头部导航搜索
		.header-nav {
			margin-top: 70rpx;
			display: flex;
			padding: 0 20rpx;
		}

		// 头部提示信息
		.header-hint {
			padding: 20rpx;
			background-color: #fff1f3;
			color: #e07f6e;
		}

		// 选择售卖区域
		.search-tab {
			padding: 20rpx;
		}
	}

	.content {
		flex: 1;
		overflow: hidden;
		display: flex;
	}

	.scroll-view {
		height: 100%;
	}

	.scroll-view-inner {}

	/* 一级分类 */
	.secondary {
		overflow: hidden;
		width: 220rpx;
		flex: none;
		background-color: #f6f6f6;

		.item {
			display: flex;
			justify-content: center;
			align-items: center;
			height: 96rpx;
			font-size: 26rpx;
			color: #595c63;
			position: relative;

			&::after {
				content: '';
				position: absolute;
				left: 42rpx;
				bottom: 0;
				width: 180rpx;
				border-top: 1rpx solid #e3e4e7;
			}
		}

		.active {
			background-color: #fff;

			&::before {
				content: '';
				position: absolute;
				left: 0;
				top: 0;
				width: 8rpx;
				height: 100%;
				background-color: #fd7047;
			}
		}
	}

	.secondary .item:last-child::after,
	.secondary .active::after {
		display: none;
	}

	/* 二级分类 */
	.three {
		background-color: #fff;
		min-height: 845rpx;

		.panel {
			display: flex;
			flex-direction: column;
			font-size: 26rpx;
			color: #595c63;
			background-color: white;
			position: relative;
			padding: 20rpx;
			border-bottom: 1rpx solid #e3e4e7;

			.three-item {
				display: flex;
				flex-direction: column;

				// 商品头部信息
				.three-top {
					display: flex;
					flex-direction: column;

					.three-top-product {
						display: flex;
						justify-content: space-between;
						padding: 0 20rpx;

						.three-top-left {
							display: flex;

							image {
								width: 80rpx;
								height: 80rpx;
							}

							.three-top-center {
								display: flex;
								flex-direction: column;
								margin-left: 20rpx;

								.center-bottom {
									padding-top: 10rpx;
								}
							}
						}

						.three-top-right {}



					}

					.sale-area {
						display: flex;
						justify-content: space-between;
						margin-top: 20rpx;
					}


				}
			}
		}

	}


	// 底部按钮
	.footer {
		display: flex;
		flex-direction: column;

		.footer-selection {
			display: flex;
			justify-content: space-between;
			padding: 20rpx;
			background-color: #f2f5ff;

			.selection-left {
				.selection-left-num {
					margin-left: 10rpx;
				}
			}
		}

		.footer-button {
			display: flex;
			justify-content: space-between;
			margin: 20rpx;

			button {
				width: 47%;
				height: 80rpx;
				line-height: 80rpx;
			}

			.font-color {
				color: white;
			}
		}

		.footer-submit {
			color: white;
			margin: 20rpx;
			height: 80rpx;
			line-height: 80rpx;
		}
	}
</style>